<template>
	<view class="address-form">
		<view class="top1 d-b-c">
			<u-tabs :list="list1" @click="handleMyComp"></u-tabs>
		</view>
		<view style="padding: 0 22rpx;" v-show="index == 0">
			<view class=" d-b-c p-20-0 mt20"
				style="background-color: #fff;padding: 20rpx; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);border-radius: 20rpx;"
				v-for="(item,index) in typelist" @click="handleComp(item)" :key="index">
				<text class="key-name" style="flex: 1;"> {{ item.name}}</text>
				<view class="d-e-c">
					<text class="icon iconfont icon-jiantou"></text>
				</view>
			</view>
		</view>
		<view v-show="index ==1">
			<view style="width: 100%;display: flex;">
				<view v-for="(item,index) in plantList" :key="index" 
				style="flex:1;display: flex;justify-content: center;line-height: 48rpx;"
				@click="plactClick(item,index)"
				:class="pIndex == index ? 'active' :''"
				>
					{{item.name}}
				</view>
			</view>
			<scroll-view scroll-y="true" style="height: calc(100vh  - 96rpx);" @scrolltolower="scrollLower">
				<view>
					<u-cell size="large" :title="item.title" :value="item.content" :label="item.orderInfo.order_no"
						v-for="(item,index) in plantListdata" @click="handleDetail(item.id)" :key="index"></u-cell>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				typelist: [],
				list1: [{
						name: "反馈建议"
					},
					{
						name: "我的反馈"
					}
				],
				index: 0,
				plantList: [{
						name: "未处理",
						value: 0
					},
					{
						name: '处理中',
						value: 1
					}, {
						name: '已处理',
						value: 2
					}
				],
				status:0,
				list_row:10,
				page:1,
				plantListdata:[],
				pIndex:0
			}
		},
		onShow() {
			this.plantListdata = []
			this.getPlantList()
		},
		methods: {
			handleDetail(id){
				uni.navigateTo({
					url:"/pages/user/cust-comp/detail?id=" + id
				})
			},
			scrollLower(){
				if(this.totalData!=this.plantListdata.length){
					this.page +1 
					this.getPlantList()
				}
			},
			getPlantList() {
				let self = this;
				let params = {
					status: self.status,
					list_row: self.list_row,
					page: self.page
				}
				self._post('order.complaint/list', params, function(res) {
					if (res.code == 1) {
						self.plantListdata = self.plantListdata.concat(res.data.data)
						self.totalData = res.data.total
					}
				})
			},
			plactClick(item,index){
				this.status = index
				this.pIndex = index
				this.plantListdata = []
				this.getPlantList()
			},
			getTypeList() {
				let self = this
				self._post('order.complaint/typeList', {}, function(res) {
					if (res.code == 1) {
						console.log(res.data, 'data')
						self.typelist = res.data
					}
				})
			},
			handleComp(item) {
				uni.navigateTo({
					url: "/pages/user/cust-comp/index?id=" + item.id
				})
			},
			handleMyComp(item) {
				// if(item.name=='我的反馈'){
				// 	uni.navigateTo({
				// 		url:"/pages/user/cust-comp/plantlist"
				// 	})
				// }
				this.index = item.index
			}
		},
		onShow() {
			this.getTypeList()
		}
	}
</script>

<style lang="scss" scoped>
	.top1 {
		color: #2F3131;
		font-size: 28rpx;
		padding: 10rpx 20rpx;
	}
	.active {
		background-color: #11A0AE;
		border-radius: 30rpx;
		color: white;
	}
	::v-deep .u-tabs {
		width: 100% !important;
	}

	::v-deep .u-tabs__wrapper__nav__item {
		flex: 1 !important;
	}
</style>